import './App.css';
import { Component } from 'react';
import { Button, Select } from 'antd';
import 'antd/dist/antd.css';
import store from './redux/store';
const { Option } = Select;
export default class App extends Component {
  state = {
    curNum: 1,
  };
  componentDidMount() {
    store.subscribe(() => {
      this.forceUpdate();
    });
  }
  render() {
    return (
      <div className='App'>
        <span>当前值：{store.getState()}</span>
        <br />
        <Select defaultValue={1} style={{ width: 120 }} onChange={curNum => this.setState({ curNum })}>
          <Option value={1}>1</Option>
          <Option value={2}>2</Option>
          <Option value={3}>3</Option>
        </Select>
        <Button onClick={this.handleCalc('increase')}>+</Button>
        <Button onClick={this.handleCalc('decrease')}>-</Button>
      </div>
    );
  }
  handleCalc = type => {
    return () => {
      store.dispatch({ type, data: this.state.curNum });
    };
  };
}
